<template>
  <div v-loading="loading">
    <div style="height: 35px; padding: 5px 5px"><el-text class="mx-1" size="large">以下为本图的下载用户</el-text></div>
    <el-space wrap>
      <el-tag v-for="item in downloadList" :key="item.Pk">{{ item.Creator!._v2 }}</el-tag>
    </el-space>
  </div>
</template>
<script setup lang="ts">
import { ref, defineProps, watch } from 'vue';
import type { DownloadHistoryModel } from '@/model/downloadhistorymodel';
import { listImg } from '@/api/downloadHistory';
const loading = ref(false);
const downloadList = ref<DownloadHistoryModel[]>([]);
const props = defineProps({
  imagePk: {
    type: String,
    default: () => {
      return '';
    },
  },
});

watch(
  () => props.imagePk,
  (to, from) => {
    if (to === '') return;
    loading.value = true;
    listImg(to)
      .then((response) => {
        downloadList.value = response.Data!;
        loading.value = false;
      })
      .catch(() => {
        loading.value = false;
      });
  },
  { immediate: true, deep: true }
);
</script>
